<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../include/base.jsp" %>
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">	
	<title>CRM-contact-list</title>
	<meta charset="UTF-8">
	<%@ include file="../include/head.jsp" %>
</head>

<body class="crm">
	
<jsp:include page="../include/top.jsp">
	<jsp:param value="contact" name="tag"/>
</jsp:include>


<div class="container-fluid">
	<div class="row-fluid">
	<div class="span8">
		<div class="well screen">
			<div class="page-header header">
						
			<select id="type" name="type">
				<optgroup label="所有..."><option value="All">所有的联系人</option>
					<option value="Person">所有的个人</option>
					<option value="Company">所有的公司</option>
					<option value="Mine">我创建的联系人</option>
				</optgroup>
			</select>

			</div>
			<div class="live_search_spinner" behavior="spinner" id="parties_loading">
			  <div class="liner">
			    <h3>处理中...</h3>
			    <img src="${basePath }/img/indicator.gif" alt="WorkXP">
			  </div>
			</div>
			<div class="main" id="main">
						


<div class="alert alert-success" style="display:none">
	<a class="close" data-dismiss="alert" href="${basePath }/contact/list">×</a>
  <span></span>
</div>
<div class="filter-desc">
	可以通过以下条件来过滤联系人:
</div>
<div class="meta">
	<ul class="nav nav-pills contact-filter">
			<li class="dropdown">
		    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath}/contact/list#">
			    	姓名<b class="caret"></b>
			    </a>
			    <ul class="dropdown-menu">
					<div class="dropdown-box">
						<form class="form-search contacts-search">
			      			<input type="text" class="input-small search-query" name="name">
							<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
			      		</form>
					</div>
			    </ul>
		 	</li>
			<li class="dropdown">
		    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath}/contact/list#">
			    	职位<b class="caret"></b>
			    </a>
			    <ul class="dropdown-menu">
					<div class="dropdown-box">
						<form class="form-search contacts-search">
					      	<input type="text" class="input-small search-query" name="title">
							<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
				      	</form>
					</div>
			    </ul>
		 	</li>
			<li class="dropdown">
		    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath}/contact/list#">
			    	邮箱<b class="caret"></b>
			    </a>
			    <ul class="dropdown-menu">
					<div class="dropdown-box">
						<form class="form-search contacts-search">
					      	<input type="text" class="input-small search-query" name="ContactEmail">
							<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
				      	</form>
					</div>
			    </ul>
		   </li>
			<li class="dropdown">
	    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath}/contact/list">
		    	电话<b class="caret"></b>
		    </a>
		    <ul class="dropdown-menu">
				<div class="dropdown-box">
					<form class="form-search contacts-search">
		      			<input type="text" class="input-small search-query" name="ContactPhone">
						<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
		    	  	</form>
				</div>
		    </ul>
		  </li>
			<li class="dropdown">
	    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath }/contact/list">
		    	地址<b class="caret"></b>
		    </a>
		    <ul class="dropdown-menu">
				<div class="dropdown-box">
					<form class="form-search contacts-search">
		      			<input type="text" class="input-small search-query" name="ContactAddress">
						<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
		     	 	</form>
				</div>
		    </ul>
		  </li>
			<li class="dropdown">
	    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath }/contact/list">
		    	背景信息<b class="caret"></b>
		    </a>
		    <ul class="dropdown-menu">
				<div class="dropdown-box">
					<form class="form-search contacts-search">
		      			<input type="text" class="input-small search-query" name="others">
						<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
		      		</form>
				</div>
		    </ul>
		  </li>
			<li class="dropdown">
	    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath }/contact/list">
		    	网站<b class="caret"></b>
		    </a>
		    <ul class="dropdown-menu">
				<div class="dropdown-box">
					<form class="form-search contacts-search">
		      			<input type="text" class="input-small search-query" name="ContactWebsite">
						<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
		      		</form>
				</div>
		    </ul>
		  </li>
			<li class="dropdown">
	    	<a class="dropdown-toggle" data-toggle="dropdown" href="${basePath }/contact/list">
		    	IM<b class="caret"></b>
		    </a>
		    <ul class="dropdown-menu">
				<div class="dropdown-box">
					<form class="form-search contacts-search">
		      			<input type="text" class="input-small search-query" name="ContactIm">
						<button type="submit" class="btn" data-loading-text="处理中..">搜索</button>
		      		</form>
				</div>
		    </ul>
		  </li>
	</ul>
</div>
<div class="filter-container" data="{}"></div>
<div class="filter-template" data="{&quot;name&quot;:&quot;\u59d3\u540d&quot;,&quot;others&quot;:&quot;\u80cc\u666f\u4fe1\u606f&quot;,&quot;title&quot;:&quot;\u804c\u4f4d&quot;,&quot;ContactAddress&quot;:&quot;\u5730\u5740&quot;,&quot;ContactWebsite&quot;:&quot;\u7f51\u7ad9&quot;,&quot;ContactPhone&quot;:&quot;\u7535\u8bdd&quot;,&quot;ContactEmail&quot;:&quot;\u90ae\u7bb1&quot;,&quot;ContactIm&quot;:&quot;IM&quot;}">
	<a class="filter" name="" data="" href="${basePath }/contact/list"><strong></strong></a>
</div>
<div id="table">
<form accept-charset="UTF-8" action="${basePath }/contact/list" class="simple_form form-inline" data-remote="true" id="batch_form" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="KFONXAgrV80PCacx2RHhLc5VP7xbjWRF+58BzWueBLs="></div>
	<input type="hidden" name="tag_id" value="" id="tag_id">
	<input type="hidden" name="check_all_contacts" id="check_all_contacts">
	<input type="hidden" name="per_page" id="per_page" value="30">
	<input type="hidden" name="contact_num" id="contact_num" value="4">
	<input type="hidden" name="add_tag" id="add_tag_hidden">
	<input type="hidden" name="update_access_policy" id="update_access_policy_hidden">
	<input type="hidden" name="destroy" id="destroy_hidden">
	<input type="hidden" name="send_email" id="send_email_hidden">
	<div id="contact_actions_container">
		<div id="selection_tip">
			<div id="select_all_contacts_container" style="display:none">
				<a href="${basePath }/contact/list">选择所有的联系人</a> ( 还有 -26 个联系人 )
			</div>
			<h5 id="selected_all_contacts" style="display:none">已经选择了所有联系人</h5>
		</div>
		<div class="selector">
			<span id="selection_summary"></span>
			<a href="${basePath }/contact/list" id="toggle_link">全选</a>
		</div>
		<div id="party_selection_controls">
			<div id="summaries">
				勾选联系人后可以批量删除和群发邮件
			</div>
			<div id="contact_actions">
				<a id="destroy_link_" data_action="destroy" class="destroy action">删除</a>
				<a id="send_email_link" data_action="send_email" class="action">群发邮件</a>
			</div>
		</div>
		

		<div id="party_selection_activities" style="display:none">
			
			<div id="confirm_destroy" class="display_none confirm_action">
				<div class="message">
		      	<h4 id="destroy_link">您确定要删除这些联系人吗？</h4>
		      		<p>所有与这个联系人相关的联系信息， 事件， 文件以及任务都将被删除。 删除后不能再恢复。</p>
		   	 	</div>
				<div class="actions submit">
					<button id="destroy_link" type="submit" class="btn btn-danger" data-loading-text="处理中..">
						<li class="icon-trash icon-white"></li> 我确定要删除这些联系人
					</button>
					<a class="btn" href="${basePath }/contact/list" onclick="toggle_action(destroy); return false;">取消</a>
		   	 	</div>
			</div>
			<div id="confirm_send_email" class="display_none confirm_action">
				<div class="message">
		      <p>使用您电脑默认的邮件程序发送邮件，例如Mail、OutLook、Foxmail等。</p>
		    </div>
				<div class="actions submit">
					<button id="submit_send_email" type="submit" class="btn btn-primary" data-loading-text="处理中..">
						<li class="icon-envelope icon-white"></li> 确认
					</button>
					<a class="btn" href="${basePath }/contact/list" onclick="toggle_action(send_email); return false;">取消</a>
		    </div>
			</div>
		</div>
	</div>
	
	<table class="table crm-table" id="contacts">
		<thead>
			<c:forEach items="${contactList }" var="contact">
			<c:choose>
			<c:when test="${contact.name == ''}">
				<!-- 公司 -->
				<tr>
					<td width="10px"><input id="id_" name="id[]" type="checkbox" value="${contact.id }"></td>
					<td width="32px"><a href="${basePath }/contact/getCompanys" data-id="${contact.id }" class="">
						<span style="display: inline-block;border:1px solid #CCCCCC;background: url('/mecrm/img/workxp_sprites.png') no-repeat 0px -148px transparent; width: 32px; padding-top: 32px;font-size:1px"></span>
					</a></td>
					<td width="">
						<h3>
							<a href="${basePath }/contact/showcompany?id=${contact.id }">${contact.companyname }</a>
							
						</h3>
						<div class="info">
							<c:forEach items="${contact.mailList }" var="mail">
								<a href="mailto:${mail.mail }">${mail.mail }</a>
							</c:forEach>
							<c:forEach items="${contact.telList }" var="tel">
								${tel.tel }
							</c:forEach>
						</div>
					</td>
					
				</tr>
			</c:when>
			<c:otherwise>
				<!-- 联系人 -->
				<tr id="id_${contact.id }">
					<td width="10px"><input id="id_" name="id[]" type="checkbox" value="${contact.id }"></td>
					<td width="32px"><a href="${basePath }/contact/show?id=${contact.id}" data-id="${contact.id }" class=""><span style="display: inline-block;border:1px solid #CCCCCC;background: url(&#39;/mecrm/img/workxp_sprites.png&#39;) no-repeat -112px -148px transparent; width: 32px; padding-top: 32px;font-size:1px"></span></a></td>
					<td width="">
						<h3>
							<a href="${basePath }/contact/show?id=${contact.id }">${contact.name }</a>
							
						</h3>
						<div class="info">
							<c:forEach items="${contact.mailList }" var="mail">
								<a href="mailto:${mail.mail }">${mail.mail }</a>
							</c:forEach>
							<c:forEach items="${contact.telList }" var="tel">
								${tel.tel }
							</c:forEach>
						</div>
					</td>
					
				</tr>
			</c:otherwise>
			
			
			</c:choose>
			</c:forEach>
		</thead>
	</table>
</form>		
		
</div>


<script type="text/javascript" charset="utf-8">
	$(document).ready(function() {
		
		$("#destroy_link").click(function(){
			var ids = "";
			var inputs = $("input[type='checkbox']");
			for(var i = 0;i < inputs.length;i++){
				if($(inputs[i]).attr("checked") == 'checked'){
					id = $(inputs[i]).val();
					$.post("${basePath}/contact/del",{"id":id},function(){
						$("#id_"+inputs[i]).fadeOut();
						$("#destroy_link").button("reset");
					});
				}
			}
			
		});
		
		
		/*
		$.get('/contacts/recent_imports', function(data) {
			$('#recent_imports').html(data);
			$("#recent_imports").has("div.title").addClass("well");
		}, 'html');
		*/
		
		init_contacts_action();
		
		ContactQuickShow.init();
		new ContactsFilter();
		
		$('#type').change(function() {
			$('body').addClass('loading');
			var filters = $(".filter-container").data("filters");
			var filter_str = '';
			if(filters) {
				filter_str = $.param(filters);
			}
			$.get('/contacts?filter=on&page=1&' + filter_str, {type: this.value}, updateContacts, 'html');
		});
	});
</script>

					</div>
				</div>
	</div>
	<div class="span4 sidebar">
		<div class="well">
			<ul id="inout">
				<li><a href="${basePath }/contact/new">添加联系人</a></li>
				<li><a href="${basePath }/contact/newcompany">添加公司</a></li>
				<li><a href="${basePath }/contact/import">导入联系人</a></li>
			</ul>
		</div>


	</div>
	</div>
</div>
	
</body></html>
